<template>
  <div class="consult">
    <!-- left-arrow -->
    <van-nav-bar title="智能核保助手" left-arrow left-text="返回" fixed placeholder @click-left="onClickLeft" />
    <img class="robotbox" :src="imgRobot" alt="">
    <div class="xcbox">
      <p>您好！我是小智，您的智能核保助手。</p>
      <p>非常高兴为您提供医疗核保咨询服务。</p>
    </div>

    <div class="subjectbox">
      <div class="title">
        <span></span>
        <p>在开始咨询前，请您先选择需要咨询的体检项目并准备好该项目的体检报告。准备好我们就可以开始啦!</p>
      </div>
      <!-- <div @click="jumpClk">jump</div> -->
      <!-- <div class="selectbox">
        <div class="selectbox-content" @click="show = true">
          <span>选择体检项目</span>
          <div>
            <span>{{projectVal}}</span>
            <van-icon name="arrow" color="#99999" />
          </div>
        </div>
        <van-action-sheet v-model="show" :actions="actions" @select="onSelect" />
      </div> -->
      <div class="tagbox">
        <span v-for="(item, index) in actions1" :class="tagIndex === index ? 'taget-index' : ''" :key="index"
          @click="tagClk(item, index)">{{ item.itemsName }}</span>
      </div>
    </div>
    <div class="subjectbox" v-if="isShow && healthByProjectFlag.length > 0">
      <div class="title">
       <p><span style="color: red;">*</span>请选择您的年龄范围</p>
      </div>
      <van-radio-group v-model="ageRadio">
        <van-radio style="margin-top: 8px;" name="1768169431084699600">{{'年龄≤35岁'}}</van-radio>
        <van-radio style="margin-top: 8px;" name="1768177137120055300">{{'35<年龄≤50'}}</van-radio>
        <van-radio style="margin-top: 8px;" name="1768177137187164200">{{'年龄＞50岁'}}</van-radio>
      </van-radio-group>
    </div>
    <div class="subjectbox" v-if="isShow && healthByProjectFlag.length > 0">
      <div class="title">
        <p>请勾选您的健康情况，以方便评估:</p>
      </div>
      <van-checkbox-group v-model="selectBox" @change="checkboxChange">
        <van-checkbox v-for="(item, i) in healthByProject" :key="i" shape="square" :name="item.propertyId">{{
      item.propertyName }}</van-checkbox>
      </van-checkbox-group>
    </div>

    <div class="xcbox" v-if="isShow" >
      <!-- <p>请将<span style="color:#e60012">{{ projectVal }}</span>的检查结果上传或者拍照。</p> -->
      <p>请通过相册选取或拍照上传该项目的体检报告</p>
			<van-uploader :after-read="afterRead" class="uploader">
				<div class="camera">
					<span>上传图片</span>
				</div>
			</van-uploader>
      <!-- <div class="camera" @click="cameraClk">
        <img :src="imgSrc" alt="">
        <span>&nbsp;拍照/上传</span>
      </div> -->
      <p class="tip">温馨提示:请截取该项目的体检报告内容</p>
    </div>
    <div class="selectbox">
      <van-action-sheet v-model="show" :actions="actions" @select="onSelect" />
    </div>
  </div>
</template>

<!-- <scrip src="../api/sino_plugins.js"></scrip> -->
<script>
import robot from "@/assets/img/jqr.png"
import camera from "@/assets/img/icon/camera.png"
import { listApi, selectProjectApi, selectHealthByProject } from "@/api/requestApi"; //调接口
// import { exportSino } from "@/api/sino_plugins";
// import { callBack } from "@/imageCase/Cordova3/sino_plugins.js"
import '@/api/photo_mainCtrl'
export default {
  name: "consult",
  components: {},
  data() {
    return {
      healthByProjectFlag:[],
      ageRadio:'',
      imgSrc: camera,
      imgRobot: robot,
      isShow: false,
      subjectShow: false,
      pShow: [0, 0, 0],
      consultVal: "了解能否购买我司的保险产品",
      projectVal: "",
      typeName: "",
      show: false,
      actions1: [
        // { itemsName: '肝部彩超', itemsCode: '001015-06', id: '5' },
        // { itemsName: '甲状腺彩超', itemsCode: '001015-06', id: '5' },
        // { itemsName: '静息心电图', itemsCode: '001015-06', id: '5' },
        // { itemsName: '胸部X光片', itemsCode: '001015-06', id: '5'},
        // { itemsName: '胸部X光片', itemsCode: '001015-06', id: '5' }
      ],
      selectActions: {},  // 选中的项目
      actions: [{ name: '拍照' }, { name: '从相册中选择' }, { name: '取消' }],
      reloadNum: 1,
      tagIndex: -1,   // 点击哪个span元素
      photoData: { // 拍照相册接口参数
        openFromGallery: null,//是否从相册选择照片：true:从相册中选择，false:拍照
        imgType: 'OtherPhoto',//固定值，千万不要改动
        direction:"1",
      },
      // photoData: { 
      //   imgID: "appntID_1", 
      //   prtNum: "E0001360455",
      //   imgType: "01_01", 
      //   width: 320, 
      //   height: 240, 
      //   picNum: 1, 
      //   mono: true, 
      //   quality: 50, 
      //   openFromGallery: null, 
      //   businessType: 10,
      //   xType: "takePhoto"
      // },
      selectBox: [],
      healthByProject: [
        {propertyId:'1768177137241690000',propertyName:'吸烟'},
        {propertyId:'1768177137317187600',propertyName:'家族肺癌史(父母/子女/兄妹)'},
        {propertyId:'1770731480620863500',propertyName:'慢性肺病史，职业病史，致癌物质暴露史'},
      ],
    }
  },

  created() {
    this.getList();
  },
  mounted() {
    this.pShow = [0, 0, 0];
    console.log('removeItem("orcParam");')
    sessionStorage.removeItem("orcParam");
  },

  methods: {
    async getList() {
      let res = await selectProjectApi();
      this.actions1 = res.data.data;
    },
    onClickLeft() {
      this.$dialog.confirm({
        title: '',
        message: '是否退出智能核保助手？',
        confirmButtonText: '确定',
      })
        .then(() => {
          try {
            console.log('回到信易通首页444444');
            let data = {
              //sessionTimeOut : sessionTimeOutFlag //"Yes" Session超时 "No":系统正常的返回
              sessionTimeOut: 'No', //"Yes" Session超时 "No":系统正常的返回
              exitSysPage: "1" //"1" 信易通首页  "2":“我”页面
            };
            setTimeout(function () {
              console.log(9999);
              cordova.sino.entryLocalSys(function () { }, data);
            }, 500);
          } catch (error) {
          }
          // this.$router.go(-1);
        })
        .catch(() => {
        });
    },

    quesFn(val) {
      if (val == 1) {
        this.consultVal = "了解能否购买医疗险";
        this.typeName = "医疗险";
      } else if (val == 2) {
        this.consultVal = "了解能否购买我司的重疾险产品";
        this.typeName = "重疾险";
      } else {
        this.consultVal = "了解能否购买我司的寿险产品";
        this.typeName = "寿险";
      }
      this.subjectShow = true;
      let newPshow = JSON.parse(JSON.stringify(this.pShow))
      for (let i = 1; i <= newPshow.length; i++) {
        if (val == i) {
          newPshow[i - 1] = 1;
        } else {
          newPshow[i - 1] = 0;
        }
      }
      this.pShow = newPshow;
      //console.log(this.pShow);
    },

    // jumpClk(){
    //   this.$router.push({ name: 'extract'})
    // },

    async tagClk(item, i) {
      this.selectActions = item;
      this.projectVal = item.itemsName;
      this.tagIndex = i;
      let { data } = await selectHealthByProject(item.id);
      this.healthByProjectFlag = data.data;
      if(data.data == [] || data.data){
        this.ageRadio = '';
        this.selectBox = [];
      }
      this.$nextTick(function(){
        this.isShow = true;
			})
    },
    cameraClk() {
      if (this.healthByProjectFlag.length > 0) {
        if (this.ageRadio == '' || this.ageRadio == null || this.ageRadio == undefined) {
          this.$dialog.confirm({
            title: '请选择您的年龄范围',
            message: '',
          }).then(() => {
          }).catch(() => {
          });
          return
        }
      }
      this.show = true;
    },
    checkboxChange(res) {
      console.log('复选框', res);
      console.log('selectBox', this.selectBox);
    },
		afterRead(file) {
			// console.log(file)
			this.photoData.openFromGallery = true;
			let data = {}
			data.Base64Img = file.content
			if (file.content == undefined || file.content == null || file.content == "") {
				return false;
			} else {
				let newParams = { ...data, ...this.photoData, ...this.selectActions, selectId: this.selectBox }
				// console.log('params参数', newParams);
				this.$router.push({ name: 'extract', params: { photoData: newParams } })
			}
		},
    onSelect(item) {
      if (item.name === '拍照') {
        console.log('点击了拍照222');
        this.photoData.openFromGallery = false;
      } else if (item.name === '从相册中选择') {
        console.log('点击了从相册中选择222');
        this.photoData.openFromGallery = true;
      } else {
        console.log('点击了取消');
        this.show = false;
        return
      }
      // setTimeout(() => {
      //   console.log('callBack', window.callBack);
      // }, 1000)
      try {
        console.log('进入try');
        // let timer = setInterval(() => {
        //   if (window.callBack) {
        //     console.log('try定时器拿到了callBack', window.callBack);
        //     clearInterval(timer);
        //     window.callBack = null;
        //   }
        // }, 300)
        cordova.sino.takePhotoOther((res) => {
          console.log('try回调函数返回成功数据了', res);
          let data = res.data;
          let val = null
          if (this.healthByProjectFlag.length > 0) {
            if (this.ageRadio !== '' && this.ageRadio !== null && this.ageRadio !== undefined) {
              this.selectBox.push(this.ageRadio);
            }
            console.log('this.selectBox.push(this.ageRadio)', this.selectBox);
          }
          if (!this.photoData.openFromGallery) {
            val = data.Base64Img;//拍照数据
            // val = data.practicalImage ? data.practicalImage : data.signMinImg;//拍照数据
          } else {
            val = data.practicalImage ? data.practicalImage : data.Base64ImgList[0]; // 从相册选择的数据
          }
          data.Base64Img = val;//拍照或相册数据
          if (val == undefined || val == null || val == "") {
            return false;
          } else {
            let newParams = { ...data, ...this.photoData, ...this.selectActions, selectId: this.selectBox }
            // console.log('params参数', newParams);
            this.$router.push({ name: 'extract', params: { photoData: newParams } })
          }
        }, this.photoData)
        // 默认情况下点击选项时不会自动收起
        // 可以通过 close-on-click-action 属性开启自动收起
        // this.projectVal = item.name;
        // this.isShow = true;
        // Toast(item.name);
      } catch (error) {
        console.log('拍照失败走了catch这里了', error);
        // let timer = setInterval(() => {
        //   if (window.callBack) {
        //     console.log('catch定时器拿到了callBack', window.callBack);
        //     clearInterval(timer);
        //     window.callBack = null;
        //   }
        // }, 300)
        // exportSino.takePhotoOther((res) => {
        //   console.log('catch回调函数返回数据成功', res);
        //   console.log(res);
        //   let data = res.data;
        //   let val = null
        //   if (!this.photoData.openFromGallery) {
        //     val = data.Base64Img;//拍照数据
        //   } else {
        //     val = data.practicalImage; // 从相册选择的数据
        //   }
        //   if (val == undefined || val == null || val == "") {
        //     this.$dialog.alert({
        //       message: '图片数据有问题，请重新拍照!',
        //       confirmButtonText: '确定'
        //     })
        //   } else {
        //     let newParams = { ...data, ...this.photoData, ...this.selectActions, selectCheckbox: this.selectBox }
        //     console.log('params参数', newParams);
        //     this.$router.push({ name: 'extract', params: { photoData: newParams } })
        //   }
        // }, this.photoData)
      }
    },

    // 点击查询
    searchClick() {
      let params = {
      }
      listApi(params).then((res) => {
        this.$store.dispatch("loading/CHANGE_LOADING", false);
        if (res.resultCode === 0) {
        }
      }).catch((err) => {
        this.$store.dispatch("loading/CHANGE_LOADING", false);
      });
    },
  }

}
</script>

<style scoped>
.robotbox {
  width: 30px;
  height: 40px;
  position: absolute;
  top: 40px;
  left: 10px;
}

.xcbox {
  background-color: #fff;
  margin: 10px;
  padding: 15px 10px;
}

.xcbox p {
  text-align: left;
  padding: 2px;
}

.xcbox .item {
  border: 1px solid #999;
  color: #999;
  border-radius: 4px;
  padding: 8px;
  margin-top: 20px;
}

.xcbox .item2 {
  border: 1px solid #e60012;
  color: #e60012;
  border-radius: 4px;
  padding: 8px;
  margin-top: 20px;
}

.xcbox .camera {
  display: flex;
  justify-content: center;
  margin: 20px auto;
  width: 90%;
  padding: 10px;
  border: 1px solid #e60012;
  border-radius: 4px;
  color: #e60012;
}

.xcbox .tip {
  color: #70B603;
  font-size: 14px;
}

.xcbox .camera img {
  width: 20px;
  height: 20px;
}

.subjectbox {
  /* height: 400px; */
  background-color: #fff;
  margin: 14px;
  padding: 10px 6px;
}

/* .subjectbox .title{
    display: flex;
  }
  .subjectbox .title span{
    width: 5px;
    height: 20px;
    background-color: #fea247;
  } */

.subjectbox p {
  text-align: left;
  line-height: 20px;
  /* height: 0px; */
}

.subjectbox .selectbox {
  margin: 14px 10px;
  border: 1px solid #999;
  border-radius: 4px;
}

.subjectbox .selectbox .selectbox-content {
  padding: 0 6px;
  height: 40px;
  line-height: 40px;
  display: flex;
  justify-content: space-between;
}

.subjectbox .tagbox {
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
}

.subjectbox .tagbox span {
  margin-top: 10px;
  padding: 6px;
  color: #999;
  border-radius: 4px;
  background-color: #f2f2f2;
  font-size: 14px;
  margin-left: 5px;
}

.subjectbox .tagbox .taget-index {
  border: 1px solid #e60012;
  color: #e60012;
}

.van-checkbox {
  margin-top: 10px;
}
.uploader{
	display: block;
}
.uploader /deep/ .van-uploader__input-wrapper{
	width: 100%;
}
</style>